<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        /* 
        // 1.JS延迟加载的方式有哪些？（5）
           （1）script写在页面底部
           （2）使用defer属性延迟加载
        // 2.前端 JavaScript 中的 ECMAScript、DOM、BOM 的含义；
            ECMAScript：定义了JavaScript的语法规范 JavaScript的核心，描述了语言的基本语法和数据类型；
            DOM：文档对象模型；
            BOM：浏览器对象模型；
        // 3.JavaScript 的数据类型有哪些？
            （1）简单数据类型：Number String  Boolean Null Undefined Symbol
            （2）引入数据类型：Object  Array   Function
        // 4.如何进行数据类型的判断？
            （1）typeof xxx方法
            （2）xxx instance  xxx方法
            （3）Object.prototype.toString.call()方法
        // 5.null 和 undefined 的区别？什么时候会得到 undefined？
            （1）null 和 undefined 的区别
                null：空值，空的对象，空的指针
                undefined：声明变量但是没有赋值，表无意义（空值）
                用typeof检测它们分别返回:undefined、object
            （2）什么时候会得到 undefined？
                声明变量没有赋值
                预解析时声明变量未定义
                对象没有的属性名
                函数定义未传参或者没有return
                数组的forEach方法，没有返回值，返回的是undefined
        // 6.如何理解 null == undefined 返回 true，null === undefined 返回 false？
            ==  只需值一样，不需要类型一致， null 和undefined都是无效的值，用==是相等的 
            ===  需要类型一致，否则为false
        // 7.使用 continue 或 break 终止循环时，两种方式的区别是？
            continue  跳出当前符合条件的流程，继续下一个流程
            break  断所有的控制流程 
        // 8.如何判断字符串内是否包含指定字符？
            (1）使用indexOf(),为-1是不包含
            (2)使用includes()方法，包含则返回true
        // 9.请尽量列举出数组的方法，并且注明哪些方法会修改原数组，哪些不会；
            不会修改原数组：includes()、indexOf()、join()、concat()、reduce()、slice()、、lastIndexOf()、forEach()、slice()
            会修改原数组：reserse()、pop()、push()、shift()、unshift()、 splice()
        // 10. var、let、const 区别？
            let和const是es6中新增定义,都是为了弥补var的一些缺陷而新设计出来的。
            let是修复了var的作用域的一些bug，变的更加好用
            同一作用域下let和const不能声明同名变量，而var可重复声明同一个变量（后面声明的值会覆盖前面的声明）
            const声明的变量只可以在声明时赋值,声明必须赋值,不可随意修改
        // 12. 如何在 DOM2 级事件绑定上传递参数？
        // 13. 怎么阻止事件的进一步传播和默认事件？
            阻止冒泡：event.stopPropagation() 
            阻止默认事件：e.preventDefault();
                例如：
                a.addEventListener("click",(e)=>{
                    e.preventDefault();
                });
        // 14. 如何添加一个一次性事件？
            使用：once:true
            box.addEventListener("click",fn(),{
                //  绑定一次事件
                once:true
            });
        // 15. 同步和异步的区别? 
            同步模式：就是后一个任务等待前一个任务结束，
                然后再执行，程序的执行顺序与任务的排列顺序是一致的、同步的。
            异步：每一个任务有一个或多个回调函数（callback），前一个任务结束后，
                不是执行后一个任务，而是执行回调函数，后一个任务则是不等前一个任务结束就执行，
                所以程序的执行顺序与任务的排列顺序是不一致的、异步的。
        // 16. AJAX是什么？AJAX是如何为页面注入灵魂？
            AJAX是一种用于创建快速动态网页的技术。
            Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求，
            从服务器获得数据，然后用javascript来操作DOM而更新页面。
            实现原理：
                1、新建XMLHttpRequest对象
                2、设置请求方式、请求地址以及是否异步处理请求
                3、将请求发送到服务器。
                4、监听XMLHttpRequest对象状态
                接收数据、操作数据
        // 17. 开发阶段的 AJAX 跨域有哪些解决方法，jsonp 的原理是什么
            （1）jsonp
                原理：利用script的src属性
            （2）正向代理和反向代理；
            （3）CORS
        // 18. 请描述一下cookies，sessionStorage和localStorage的区别
            cookies:限制大小为4kb左右,可以设置cookie过期时间
            sessionStorage：用于保存临时同一个窗口的数据，关闭窗口之后数据就会被删除
            localStorage：普遍标准限制大小在5M左右(大小限制和不同浏览器有关)，键值对形式进行存储
        // 19. 讲一下常见的异步场景，以及传统异步的诟病和解决方案
            如常见的点击菜单栏页面异步刷新
        // 20. 数组如何实现去重？请提供至少2种方法
            （1）使用Set:
                var arr = [3, 5, 2, 2, 5, 5];
                console.log([...new Set(arr)])  //  [3, 5, 2]     
            （2）使用indexOf判断去重：array .indexOf(arr[i]) === -1
            （3）使用for循环和splice
        // 21. 讲一下对基本数据类型 和 复杂/引用数据类型的理解？
            （1）简单数据类型(又叫做基本数据类型或者值类型)：在存储时变量中存储的是值本身，因此也叫值类型；
            （2）复杂数据类型：在存储时，变量中存储的仅仅是地址，因此叫做引用数据类型。
        // 22. this 的指向如何确定？
            全局上下文（函数外）
                无论是否为严格模式，均指向全局对象。注意:严格模式下全局对象为undifined
            函数上下文（函数内）
                默认的，指向函数的调用对象，且是最直接的调用对象
            箭头函数的情况：
                箭头函数没有自己的this，继承外层上下文绑定的this。
        // 23. 谈谈对垃圾回收机制的认识
            找到那些不再继续使用的变量，然后释放其占用的内存。具体实现的方法有两种：标记清除和引用计数。
        // 24. 什么是回流重绘，如何进行优化？
            （1）回流重绘
                回流：当render tree的一部分或者全部元素因改变了自身的宽高，布局，显示或隐藏，
                    或元素内部的文字结构发生变化，导致需要重新构建页面的时候，回流就产生了。
                重绘：当一个元素自身的宽高，布局，及显示或隐藏没有改变，而只是改变了元素的外观风格的时候，就产生了重绘。
                回流必定触发重绘，而重绘不一定出发回流。
            （2）优化：
                不使用能够触发回流的属性。
                建立一个图层，让回流在图层里面进行，限制回流和重绘的范围，减少浏览器的运算工作量。
                尽量不要使用table布局，因为一个小小的改动可能会使整个table进行重新布局。
                不要频繁操作元素的样式，对于静态页面，可以修改类名，而不是样式。
                使用transform代替top，left，margin-left等属性
                将DOM的多个读写操作放在一起，而不是读写操作穿插着写。
        // 25. 请解释什么是事件代理
            事件代理的实现原理是利用冒泡和目标元素，把处理的事件添加到父元素，等待子元素事件的冒泡，
                并且可以通过父元素event.target判断哪个是子元素，从而做出处理.
        // 26. 谈谈你对渐进增强和优雅降级的理解(补充)
            （1）渐进增强(Progressive Enhancement):
                先针对低版本的浏览器进行构建页面，保证最基本的功能，然后在针对高级浏览器进行效果，交互等改进和追加功能达到更好的用户体验。
            （2）优雅降级(Graceful Degradation):
                一开始就针对高版本的浏览器构建完整的功能，然后在针对低版本的浏览器进行兼容。
            优雅降级是从复杂的现状开始，并试图减少用户体验的供给，而渐进增强则是从一个非常基础的，
                能够起作用的版本开始，并不断地扩充，以适应未来环境的需要。
                降级（功能衰减）意味着往回看；而渐进增强则意味着朝前看，同时保证其根基处于安全地带。
        */
    </script>
</body>

</html>